<template>
    <a-modal
        :open="open"
        title="修改备注"
        @ok="handleOk"
        :destroyOnClose="true"
        cancelText="取消"
        okText="确认"
        @cancel="handleCancel"
    >
        <Input placeholder="请输入名称" v-model:value="remark" />
    </a-modal>
</template>

<script setup lang="ts">
import {ref, onBeforeUnmount} from "vue";
import {Input} from "ant-design-vue";

// 数据
const remark = ref("");
const open = ref(false);

const handleOk = () => {
    open.value = false;
    console.log(remark.value);
};
// 关闭弹窗
const handleCancel = () => {
    open.value = false;
};

// 暴露给父组件调用的方法
defineExpose({
    show: () => {
        open.value = true;
    },
});
// 销毁时清空数据
onBeforeUnmount(() => {
    remark.value = "";
});
</script>

<style scoped></style>
